<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>TestEdge</title>
		<!--<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/pdb_assess_jquery-ui.css" />
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/pdb_assess_jquery.jscrollpane.css" />
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/pdb_assessment.css" />-->
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/jquery-ui.css" />
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/jquery.jscrollpane.css" />
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/style_testEdge.css" />
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/style_testEdge_custom.css" />
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery-1.8.2.min.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery-ui.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery-ui-timepicker-addon.js"></script>

		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/pdb_asses_common.js"></script>
	
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/knockout-2.2.1.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery.tablesorter.min.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery.jscrollpane.min.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery.mousewheel.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/teservices.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/knockout.validation.js"></script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/jquery.loader.js"></script>
		<link rel="stylesheet" type="text/css" href="/ce-static-testedge/common/css/jquery.loader.css"/>

		<script type="text/javascript" src="/ce-static-testedge/ayp/jscripts/ayp_principaldb_assessment_main.js" defer="defer"></script>
		<script>
			//document.getElementById("page-loader").style.display = "block";
			$(document).ready(function(e) {
				baseurl = $('#baseUrl').val();
				sectionID = $('#sectionId').val();
				console.log("====sectionID====>",sectionID);
				sectionTitle = $('#sectionTitle').val();
				mode = $('#mode').val();
				//console.log(mode, "initialize :::", sectionTitle);
				aypId=$("#aypId").val();
				//console.log("aypId====",aypId);
				_startDate=$("#startDate").val();
				_endDate=$("#endDate").val();
				//console.log("_startDate====",_startDate,"===_endDate=",_endDate);
				selectedAssId=$("#assessmentId").val();
				//console.log("_assessmentid====",selectedAssId);
				initialize();
				displayAttendance=false;
				displayPendingAttendance=false;
				displayNonWorkingDays = false;
				displayDailyLog = false;
			})
		</script>
		<style type="text/css">
			.subSubject {
				float: left;
			}
			.subSubjectInner {
				float: left;
				width: 100%;
				height: 40px;
				margin-top: 5px;
			}
			.validationMessage {
				color: Red;
			}
			.customMessage {
				color: Orange;
			}
			.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
			.ui-timepicker-div dl { text-align: left; }
			.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
			.ui-timepicker-div dl dd { margin: 0 10px 10px 30%; }
			.ui-timepicker-div td { font-size: 90%; }
			.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
			
			
			.ui-timepicker-rtl{ direction: rtl; }
			.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
			.ui-timepicker-rtl dl dt{ float: right; clear: right; }
			.ui-timepicker-rtl dl dd { margin: 0 45% 10px 10px; }
			.ui-slider-handle { top:-3px !important; }
			.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
				float:left;
				background: #900;
				display: none;
				}
			.orangeText{
				color:#ABEB8D !important;
			}
			.greenText{
				color:#ABEB8D !important;
			}
			.blackText{
				color:#000000 !important;
			}
		</style>
	</head>

	<body>
		<!--<div id="page-loader">

		<img src="/ce-static-testedge/common/images/ajax-loader.gif" alt="loader" />
		<h3 data-bind="text:msgText"></h3>
		<div id="closeBtn" data-bind="visible:visibleClose, click:closeErrorPopup"><img src="/ce-static-testedge/common/images/cross-icon.png" alt="close" />
		</div>
		</div>-->
		<!--BO Main Content -->

		<div class="contentWrapper">
			<div class="wrapper">
				<div class="testEdgeMainContent">
					<h1 class="titleMain" style="margin-bottom: -24px">Assessment Schedule: <span data-bind="text:sectionTitle">Primary</span><a href="#."  onclick="showHelp(event)" style="margin-top: 10px; margin-right: 13px; height: 26px; color: #000; font: 12px normal arial,sans-serif; overflow: hidden;"  class="iconHelp floatright"></a></h1>
					<div  class="help"></div>
					<a class="floatright" href="#" style="margin-right: 10px" data-bind="click: $root.clickBack"> &lt; Back to Academic Year</a>
					<div class="marginRight20 marginLeft20" >	
						<!--<input type="text" class="timepicker" placeholder="Choose.."/>-->					
						<!--a href="#">Academic Year 2013-2014</a>
						<h2 class="title2">Summative Assessment Schedule: Primary</h2-->
						<span class="displayBlock gray">&nbsp;</span>
						<div class="yearSelection" >
							<label class="floatleft" style="font-size: 13px; font-weight:bold;">Grade:</label>
							<div class="ci-dropdown width105 floatleft" style="width:200px; font-size: 13px;">

								<a  href="#." class="ddheading" >
								<p id="dd" class="text-format-15" data-bind="text:SelectedClass">
									1
								</p></a>
								<ul data-bind="foreach:gradeArr">
									<li style="width:200px;">
										<a href="#." data-bind="text: gradeTitle, click: selectGrade"></a>
									</li>
								</ul>

							</div>
						</div>
					</div>
					<!--div style="float: right; margin-right: 10px; font-size: 13px; cursor: pointer;" data-bind="click: $root.clickBack">
					 <a>&lt; Back to Academic Year</a>
					</div-->
					<div class="scroll-pane9 padding20">
						<div class="gradeData" >
							<div class="heading" style="font-size: 13px;">
								<span class="width80 marginRight marginLeft20">Name</span>
								<span class="width140 marginRight">Term</span>
								<span class="width160 marginRight" style="width:172px;">Assessment Window</span>
								<span class="width105 marginRight">Weightage (%)</span>
								<span>Status</span>
								<div class="clearBoth"></div>
							</div>

							<div id="accordion" data-bind="foreach:SelectedGradeData()[0].tests, jqAccordion: {options: { active: true, collapsible: true, heightStyle: 'content'} }">

								<!--<h3 class="floor" data-bind="visible: isEditMode(), click : clickTab">-->
									
								<h3 class="floor" style="margin-top: 2px;" data-bind="click : clickTab, attr: {'id': aindex}">
									<span class="bold width105 marginRight floatleft" style="width:75px;" data-bind="text:assessmentTitle_t"></span>
									<span class="bold width150 floatleft" data-bind="text:termTitle_t"></span>
									<span class="bold width160 marginRight20 floatleft" style="width:165px;" style="border:1px solid red;" data-bind="text:assessmentWindow_t"></span>
									<span class="bold width105 marginRight floatleft" data-bind="text:weightage"></span>
									<span class="bold width90 marginRight floatleft blackText" data-bind="text:statusText()"></span>
									<span data-bind="visible: isEditMode"><span class="marginRight floatleft" style="width:70px; color: #4727E9;" ><button style="font-size: 10px;" class="te-button" data-bind="visible:saveAsDraftVisible, click:saveData">Publish</button></span>
									<span class="floatleft" style="color: #4727E9;" ><button class="te-button" style="font-size: 10px;"  data-bind="visible:saveVisible, click:saveAsDraft">Save As Draft</button></span></span>
								</h3>
								<!--<h2<button style="position: relative; top: -30px;">Publish</button></h2>-->
								<!--<div class="gradeData" data-bind="visible: isEditMode()" >-->
								<div class="gradeData">
									<table border="1" class="schoolEventstable create_ayp_fontSize12" >
										<thead>
											<tr class="border-bottom">
												<th class="header" style="width:120px;">Subject</th>
												<th class="header" style="width:170px;">Date</th>
												<th class="header" style="width:180px;">Start Time</th>
												<th class="header" style="width:200px;">Duration</th>
												<th class="header" style="width:240px;">Total Marks </th>
											</tr>
										</thead>
										<tbody data-bind="template: { name: 'scheduelEditTemplete', foreach: tests }" ></tbody>
									</table>
								</div>

								<!-- <h3 class="floor" data-bind="visible: isEditMode() ? false : true, click : clickTab">
								<span class="bold width70 marginRight floatleft" data-bind="text:assessmentTitle_t"></span>
								<span class="bold width160 floatleft" data-bind="text:termTitle_t"></span>
								<span class="bold width160 marginRight20 floatleft" data-bind="text:assessmentWindow_t"></span>
								<span class="bold width105 marginRight floatleft" data-bind="text:weightage"></span>
								<span data-bind="text:statusText()"></span>
								</h3>
								<div class="gradeData" data-bind="visible: isEditMode() ? false : true">
								<table border="1" class="schoolEventstable">
								<thead>
								<tr class="border-bottom">
								<th class="header" style="width:70px;">Subject</th>
								<th class="header" style="width:140px;">Date</th>
								<th class="header" style="width:200px;">Start Time</th>
								<th class="header" style="width:200px;">Duration</th>
								<th class="header" style="width:240px;">Total Marks	</th>
								</tr>
								</thead>
								<tbody data-bind="template: { name: 'scheduelViewTemplete', foreach: tests }" ></tbody>
								</table>
								</div>-->

							</div>
						</div>
					</div>
					<!--<div class="bottomButton marginRight">-->
						<!--<a href="#" class="te-button buttonBlue floatleft" data-bind="visible: isEditMode, click:saveData">Publish</a>
						<a href="#" class="te-button buttonBlue floatleft" data-bind="visible: isEditMode, click:saveAsDraft">Save As Draft</a>-->
						<!--<a href="#" class="te-button buttonGray floatleft">Cancel</a>-->
						<!--<span id="sameMsg" style="visibility:hidden; size:18px; font-weight:bold;" data-bind="text:msgText">Save data successfuly.</span>-->
						<!--<a href="#" class="te-button buttonGray floatright" data-bind="click: clickBack">Back to Academic Year 2013-2014</a>-->
						<!--<div class="clearBoth"></div>
					</div>-->

				</div>
			</div>
		</div>
		</div>
		
		
		
		<div id="dialog-Errors-Tab2" title="Publish">
			<div class="sectionContainer">
				<p align="middle" data-bind="text:msgText">
					Publish data.
				</p>
			</div>
			<div class="bottomButton">
				<a href="#" onclick="closeDialog()" class="te-button buttonBlue floatleft">Close</a>
				<div class="clearBoth"></div>
			</div>
		</div>
		<!--EO Main Content -->

		<script type="text/html" id="scheduelEditTemplete">
			<tr data-bind="visible: tests().length == 0">
			<td class="lineHeight24" style="width:120px;" data-bind="text:subjectTitle"></td>
			<td><label class="floatleft datepickerLabel validationMessage">
				<input type="text" name="date" class="datepicker" data-bind="text:testDateSave, jqueryUIBindings: {options: { uiType: 'date'}}, value:testDateSave" placeholder="Choose.."/></label>
				<div style="float:left; color:red;" data-bind='visible: testDateValid'>Enter valid Date</div>
			</td>
			<td>
			<input style="width:130px;" type="text" name="time" class="timepicker" placeholder="Choose.." data-bind="text:startTimes, jqueryUIBindingstimer: {options: { uiType: 'time'}}, value:startTimes"/>
			<!--<input type="text" class="floatleft width44 marginRight" placeholder="HH.MM" data-bind="text:startTimes, value:startTimes" />-->
			
			<!--<div class="textInput3 up" style="display:none">AM</div>-->
			<!--<div class="spinner">
			<div class="textInput3 down" data-bind="text:evmr, value:evmr">PM</div>
			<div class="floatleft spinner-arrow">
			<a href="#." class="spin-left-arrow show" data-toggle="t1" data-bind="click:function (data) { ampm('AM', data) }">&nbsp;</a>
			<a href="#." class="spin-right-arrow show" data-toggle="t2" data-bind="click:function (data) { ampm('PM', data) }">&nbsp;</a>
			</div>
			</div>
			<div style="float:left; color:red;" data-bind='visible: !startTimes.isValid()'>Value must equal</div>-->
			<!--MANI<div style="float:left; color:red;" data-bind='visible: (startTimesvalid && isSubmitted)'>Enter valid Time</div>-->
			</td>
			<td>
			<!--<span data-bind="visible: durationH.hasError, text: durationH.validationMessage"> </span>-->
			<!--<input type="spinner" class="timeSpinner" data-bind="spinner: durationH, valueUpdate: 'afterkeydown', value:durationH" />			
			<input type="spinner" class="timeSpinner" data-bind="spinner: durationM, valueUpdate: 'afterkeydown', value:durationM"/>-->
			<input type="text" name="time" style="width:130px;" class="timepicker" placeholder="00:30" data-bind="text:duration, jqueryUIBindingsduration: {options: { uiType: 'time'}}, value:duration"/>
			<!--MANI<div style="float:left; color:red;" data-bind='visible: durationvalid'>Enter value greater than 0</div>-->
			<!--<div style="float:left; color:red;" data-bind='visible: !durationH.isValid()'>Enter value greater than 0</div>
			<div style="float:left; color:red;" data-bind='visible: !durationM.isValid()'>Enter value greater than 0</div>-->
			<!--<div style="float:left; color:red;" data-bind='visible: durationM.hasError, validationMessage: durationM'> </div>-->

			</td>
			<td><input type="text" class="width120" placeholder="Type.." data-bind="text:testTotalMarks, value:testTotalMarks" /></td>
			</tr>

			<tr data-bind="visible: tests().length > 0">
			<td colspan="5" data-bind="text:subjectTitle"></td>
			</tr>
			<tr data-bind="visible: tests().length > 0">
			<td colspan="5" style="background-color:#E9E9E9;">
			<div data-bind="foreach:tests">
			<div class="subSubjectInner" style="border-bottom: 1px solid #FFFFFF;">
			<div class="subSubject" style="width:120px;" data-bind="text:subjectTitle"></div>
			<div class="subSubject" style="width:165px;"><label class="floatleft datepickerLabel validationMessage">
				<input type="text" name="date" class="datepicker" data-bind="text:testDateSave, jqueryUIBindings: {options: { uiType: 'date'}}, value:testDateSave" placeholder="Choose.."/></label>
				<div style="float:left; color:red;" data-bind='visible: testDateValid'>Enter valid Date</div>
			</div>
			<div class="subSubject" style="width:180px;">
			<!--<input type="text" class="floatleft width44 marginRight" placeholder="HH.MM" data-bind="text:startTimes, value:startTimes" />-->
			<input type="text" style="width:130px;" name="time" class="timepicker" placeholder="Choose.." data-bind="text:startTimes, jqueryUIBindingstimer: {options: { uiType: 'time'}}, value:startTimes"/>
			<!--<div class="textInput3 up" style="display:none">AM</div>-->
			<!--<div class="spinner" >			
			<div class="textInput3 down" data-bind="text:evmr, value:evmr">PM</div>

			<div class="floatleft spinner-arrow">
			<a href="#." class="spin-left-arrow show" data-toggle="t1" data-bind="click:function (data) { ampm('AM', data) }">&nbsp;</a>
			<a href="#." class="spin-right-arrow show" data-toggle="t2" data-bind="click:function (data) { ampm('PM', data) }">&nbsp;</a>
			</div>
			</div>
			<div style="float:left; color:red;" data-bind='visible: !startTimes.isValid()'>Value must equal</div>-->
			<div style="float:left; color:red;" data-bind='visible: startTimesvalid'>Enter valid Time</div>
			</div>
			<div class="subSubject" style="width:192px;">
			<!--<input type="spinner" class="timeSpinner" data-bind="spinner: durationH, valueUpdate: 'afterkeydown', value:durationH" />
			<input type="spinner" class="timeSpinner" data-bind="spinner: durationM, valueUpdate: 'afterkeydown', value:durationM"/>-->
			<input type="text" name="time" style="width:130px;" class="timepicker" placeholder="00:30" data-bind="text:duration, jqueryUIBindingsduration: {options: { uiType: 'time'}}, value:duration"/>
			
			<div style="float:left; color:red;" data-bind='visible: durationvalid'>Enter value greater than 0</div>
			<!--<div style="float:left; color:red;" data-bind='visible: !durationH.isValid()'>Enter value greater than 0</div>
			<div style="float:left; color:red;" data-bind='visible: !durationM.isValid()'>Enter value greater than 0</div>-->
			</div>
			<div><input type="text" class="width120" placeholder="Type.." data-bind="text:testTotalMarks, value:testTotalMarks" /></div>
			</div>
			</div>
			</td>
			</tr>

		</script>
		<script type="text/html" id="scheduelViewTemplete">
			<tr data-bind="visible: tests().length == 0">
			<td class="lineHeight24" data-bind="text:subjectTitle"></td>
			<td data-bind="text:testDate"></td>
			<td data-bind="text:comStartTime"></td>
			<td data-bind="text:totalTime"></td>
			<td data-bind="text:testTotalMarks"></td>
			</tr>
			<tr data-bind="visible: tests().length > 0">
			<td colspan="5" data-bind="text:subjectTitle"></td>
			</tr>
			<tr data-bind="visible: tests().length > 0">
			<td colspan="5" data-bind="foreach:tests">
			<div style="clear:left; float:left; width:100%;">
			<div style="float:left; width:90px;" data-bind="text:subjectTitle"></div>
			<div style="float:left; width:145px;" data-bind="text:testDate"></div>
			<div style="float:left; width:206px;" data-bind="text:comStartTime"></div>
			<div style="float:left; width:200px;" data-bind="text:totalTime"></div>
			<div style="float:left; width:220px;" data-bind="text:testTotalMarks"></div>
			</div>
			</td>
			</tr>
		</script>
		<script type="text/javascript" src="/ce-static-testedge/common/jscripts/knockout.mapping-latest.js"></script>
	<script type="text/javascript" src="/ce-static-testedge/common/jscripts/datecontroller.js"></script>
	</body>
</html>
